<template>
  <el-form-item>
    <el-select placeholder="一级类别" v-model="first_type" @change="type_change(1)" filterable clearable style="width:120px;">
      <el-option v-for="item in first_type_list" :key="item.id" :label="item.name" :value="item.id"></el-option>
    </el-select>
    <el-select placeholder="二级类别" v-model="second_type" @change="type_change(2)" filterable clearable 
    v-if="isShowTwo" style="width:120px;">
      <el-option v-for="item in second_type_list" :key="item.id" :label="item.name" :value="item.id">
      </el-option>
    </el-select>
    <el-select placeholder="三级类别" v-model="third_type" @change="type_change(3)" filterable clearable 
    v-if="isShowThree" style="width:120px;">
      <el-option v-for="item in third_type_list" :key="item.id" :label="item.name" :value="item.id"></el-option>
    </el-select>
  </el-form-item>
</template>
<script>
import { get_gift_type } from '@/api/common/gift.js';
export default {
  name: 'DjGiftTypeSelect',
  props: {
    isShowThree: {
      type: Boolean,
      default: true
    },
    isShowTwo: {
      type: Boolean,
      default: true
    },
    data: {
      type: Object,
      default() {
        return {};
      }
    },
    from: {
      type: Number,
      default: 0
      // 1：供应商，2：中央仓
    },
    usedfor: {
      type: Number,
      default: 0
      // 1:运管系统采购下单，2：采购平台总部下单，3：采购平台总部统配
    }
  },
  data() {
    return {
      first_type: '',
      second_type: '',
      third_type: '',
      first_type_list: [],
      second_type_list: [],
      third_type_list: [],
      first_type_list_data: [],
      second_type_list_data: [],
      third_type_list_data: [],
      second_one: [],
      third_one: []
    };
  },
  created() {
    this.get_first_type();
  },
  methods: {
    type_change(level) {
      if (level == 1) {
        this.second_type = '';
        this.third_type = '';
        this.second_type_list = [];
        this.third_type_list = [];
        if (this.first_type) this.get_second_type(this.first_type);
      } else if (level == 2) {
        this.third_type = '';
        this.third_type_list = [];
        if (this.second_type) this.get_third_type(this.second_type);
      }
      let val = {
        first_type: this.first_type,
        second_type: this.second_type,
        type: this.third_type
      };
      this.$emit('change', val);
    },
    get_first_type() {
      // console.log("DjGiftTypeSelect  ???")
      if (this.first_type_list_data.length == 0) {
        get_gift_type({ id: 0 }).then(response => {
          if (response) this.first_type_list_data = response;
          else this.first_type_list_data = [];
          this.first_type_list = this.first_type_list_data;
        });
      } else {
        this.first_type_list = this.first_type_list_data;
      }
    },
    get_second_type(id) {
      if (this.second_one.length == 0) {
        let obj = {};
        get_gift_type({ id: id }).then(response => {
          if (response) this.second_type_list_data = response;
          else this.second_type_list_data = [];
          this.second_type_list = this.second_type_list_data;

          obj[id] = this.second_type_list_data;
          this.second_one.push(obj);
        });
      } else {
        let obj = {};
        let result = this.second_one.some(item => {
          if (Object.keys(item)[0] == id) return true;
          else return false;
        });
        //
        if (result) {
          let myarr = this.second_one;
          for (let value of myarr) {
            if (Object.keys(value)[0] == id) this.second_type_list_data = Object.values(value)[0];
            this.second_type_list = this.second_type_list_data;
          }
        } else {
          get_gift_type({ id: id }).then(response => {
            if (response) this.second_type_list_data = response;
            else this.second_type_list_data = [];
            this.second_type_list = this.second_type_list_data;

            obj[id] = this.second_type_list_data;
            this.second_one.push(obj);
          });
        }
      }
      //  console.log(2,this.second_one)
    },
    get_third_type(id) {
      if (this.third_one.length == 0) {
        let obj = {};
        get_gift_type({ id: id }).then(response => {
          if (response) this.third_type_list_data = response;
          else this.third_type_list_data = [];
          this.third_type_list = this.third_type_list_data;

          obj[id] = this.third_type_list_data;
          this.third_one.push(obj);
        });
      } else {
        let obj = {};
        let result = this.third_one.some((item, index) => {
          if (Object.keys(item)[0] == id) return true;
          else return false;
        });
        if (result) {
          let myarr = this.third_one;
          for (let value of myarr) {
            if (Object.keys(value)[0] == id) this.third_type_list_data = Object.values(value)[0];
            this.third_type_list = this.third_type_list_data;
          }
        } else {
          get_gift_type({ id: id }).then(response => {
            if (response) this.third_type_list_data = response;
            else this.third_type_list_data = [];
            this.third_type_list = this.third_type_list_data;

            obj[id] = this.third_type_list_data;
            this.third_one.push(obj);
          });
        }
      }
      //  console.log(3,this.third_one)
    }
    // get_second_type(id) {
    //     get_gift_type({ id: id }).then(response => {
    //       if (response) this.second_type_list_data = response;
    //       else this.second_type_list_data = [];
    //       this.second_type_list = this.second_type_list_data;
    //     });
    // },
    // get_third_type(id) {
    //     get_gift_type({ id: id }).then(response => {
    //       if (response) this.third_type_list_data = response;
    //       else this.third_type_list_data = [];
    //       this.third_type_list = this.third_type_list_data;
    //     });
    // }
  }
};
</script>